<template>
	<view class="btn" :style="[{ 'box-shadow': shadow ? '0px 5rpx 11.4rpx 2px rgba(0, 0, 0, 0.25)' : '' }, customStyle]">
		<u-button
			type="success"
			:customStyle="customStyle"
			:hairline="plain"
			:plain="plain"
			:open-type="openType"
			:color="btn_bg"
			:hoverClass="hoverClass"
			@getphonenumber="getphonenumber"
			@click="emit('click')"
		>
			<slot>{{ btn_text }}</slot>
		</u-button>
	</view>
</template>

<script setup>
import { computed } from 'vue';
import { useCounter } from '../mixins/userHooks';
import { LoginCenterApi } from '../api/serves';
let { getUserInfo, tool } = useCounter();
const props = defineProps({
	plain: {
		type: Boolean,
		default: false
	},

	hoverClass: {
		type: Boolean,
		default: true
	},
	btn_text: {
		type: String,
		default: '默认按钮'
	},
	btn_bg: {
		type: String,
		// default: 'linear-gradient(90deg, #A30114 0%, #7E000F 100%)'
		default: '#000'
	},
	width: {
		type: String,
		default: '690rpx'
	},
	height: {
		type: String,
		default: '90rpx'
	},
	shadow: {
		type: Boolean,
		default: false
	},
	openType: {
		type: String,
		default: ''
	},
	f_size: {
		type: String,
		default: '28rpx'
	},
	rounded: {
		type: String,
		default: '0'
	}
});
const customStyle = computed(() => {
	return {
		width: props.width,
		height: props.height,
		'font-size': props.f_size,
		'border-radius': props.rounded + ' !important',
		'border-width': props.plain ? '2rpx !important' : '0',
		padding: 0
	};
});
const emit = defineEmits(['click']);
const getphonenumber = async (e) => {
	if (!e.detail.encryptedData) return tool.alert('授权失败');
	console.log(e, '123');
	const { code, data, msg } = await LoginCenterApi.decryptData({
		jsCode: e.detail.code
	});
	if (code != 1) return tool.alert(msg);
	tool.alert('授权成功');
	getUserInfo();
	emit('getphonenumber', e);
};
</script>

<style lang="scss" scoped>
::v-deep .u-button--plain {
	background: transparent !important;
}
</style>
